<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
    <meta name="renderer" content="webkit">
    <title>移动监控云播</title>
    <style>
        html,body{margin:0; padding: 0;text-align: center;}
        video{max-width: 1200px;width: 100%;}
    </style>
    <script src="https://open.ys7.com/sdk/js/1.1/ezuikit.js"></script>
</head>
<script>
</script>
<body>

<video id="myPlayer" poster="${request.getContextPath()}/public/images/timg.gif" controls playsInline webkit-playsinline autoplay>
    <source src="${camera.m3u8?default('')}" type="application/x-mpegURL" />
</video>


<div class="" id="description" style="padding: .25rem .21rem .45rem;">

    <h3>摄像头名称：${camera.name?default("")}</h3>
    <div style="padding-top: 20px;">
        <p>使用说明：</p>
        <p style="padding-top: 5px;">4G环境下仅可浏览15秒。如需延长浏览时间请联系客服购买流量。 客服电话：021-51666898</p>

        <p style="font-size: 30px" id="p_showTime"></p>

    </div>

</div>

<script>
    var player = new EZUIPlayer('myPlayer');

    player.play();

    player.on('error', function(){
        console.log('error');
    });
    player.on('play', function(){
        console.log('play');
    });
    player.on('pause', function(){
        console.log('pause');
    });
    player.on('waiting', function(){
        console.log('waiting');
    });

    //可以播放时，开启倒计时
    player.on('canplaythrough',function(){

        //秒关闭页面
        window.setTimeout("timeOut()",1000);

    });


    // 日志
    player.on('log', log);

    function log(str){
//        var div = document.createElement('DIV');
//        div.innerHTML = (new Date()).Format('yyyy-MM-dd hh:mm:ss.S') + JSON.stringify(str);
//        document.body.appendChild(div);
        console.log(str);

    }


    var i=60;

    //倒计时
    function timeOut(){

        if(i==1){

            window.close();
        }

        i--;

        document.getElementById("p_showTime").innerHTML = "还有 "+i+" 秒关闭本页面";

        window.setTimeout("timeOut()",1000);

    }

</script>
</body>
</html>